<template>
	<div>
		<el-dialog :title="params.isEdit?'修改':'手动录入'" :visible.sync="windowVisible" width="1200px" :close-on-click-modal="false">
			<div class="my-form-container" style="height:402px;width: 1000px;">
				<el-form ref="dataForm" :model="dataForm" class="demo-ruleForm">
					<el-row class="my-form-item">
						<el-col :span="12">
							<div class="my-form-item-label">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</div>
							<div class="my-form-item-value">
								<div style="display:flex;align-items:center" v-if="!params.isEdit">
									<el-input class="inputWidth" v-model="dataForm.studentName" disabled style="width:100px"></el-input>
									<span class="small-btn edit-green" @click="choseDialog">
										<img src="../../../assets/assessment/icon-plan-record-detail.png"> 选择
									</span>
								</div>
							</div>
						</el-col>
						<el-col :span="12">
							<div class="my-form-item-label">性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别</div>
							<div class="my-form-item-value">{{dataForm.gender}}</div>
						</el-col>
					</el-row>
					<el-row class="my-form-item">
						<el-col :span="12">
							<div class="my-form-item-label">院&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;系</div>
							<div class="my-form-item-value">{{dataForm.dept}}</div>
						</el-col>
						<el-col :span="12">
							<div class="my-form-item-label">专业班次</div>
							<div class="my-form-item-value">{{dataForm.className}}</div>
						</el-col>
					</el-row>
					<el-row class="my-form-item">
						<el-col :span="12">
							<div class="my-form-item-label">学&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号</div>
							<div class="my-form-item-value">{{dataForm.studentCode}}</div>
						</el-col>
						<el-col :span="12">
							<div class="my-form-item-label">身份证号</div>
							<div class="my-form-item-value">{{dataForm.idCard}}</div>
						</el-col>
					</el-row>
					<el-row class="my-form-item">
						<el-col :span="12">
							<div class="my-form-item-label">考试成绩</div>
							<el-form-item  prop="nativePlace">
								<div class="my-form-item-value">
									<el-input class="inputWidth" v-model="dataForm.totalPoints"></el-input>
								</div>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<div class="my-form-item-label">标准</div>
							<el-form-item  prop="nation">
								<div class="my-form-item-value">
									<el-select v-model="dataForm.nativePlace" placeholder="请选择">
										<el-option label="优秀" value="优秀"></el-option>
										<el-option label="良好" value="良好"></el-option>
										<el-option label="合格" value="合格"></el-option>
										<el-option label="不合格" value="不合格"></el-option>
									</el-select>
								</div>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row class="my-form-item">
						<el-col :span="24">
							<div class="my-form-item-label">证书编号</div>
							<el-form-item  prop="certificate">
								<div class="my-form-item-value">
									<el-input class="inputWidth" v-model="dataForm.certificate"></el-input>
								</div>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row class="my-form-item" style="border:none;height: 100px;">
						<el-col :span="24">
							<div class="my-form-item-label">备注</div>
							<el-form-item  prop="scoreRemark">
								<div class="my-form-item-value assessment-design" style="line-height:88px">
									<el-input type="textarea" style="width: 400px;" :rows="3" v-model="dataForm.scoreRemark"></el-input>
								</div>
							</el-form-item>
						</el-col>
					</el-row>
				</el-form>
			</div>
			<div class="button-group">
				<div @click="saveEdit">保存</div>
				<div @click="windowVisible=false">取消</div>
			</div>
		</el-dialog>
		<ChoseStudent ref="choseDialog" ></ChoseStudent>
	</div>
</template>
<script>
import {saveCusExam,saveEditCusExam,cusDetail} from "@/api/exam";
import ChoseStudent from '@/components/choseStudent';

export default {
  data() {
    return {
      windowVisible:false,
      dataForm:{
        studentName:'',//学员姓名
        studentCode:'',//学号
		idCard:'',//身份证号
		gender:'',//性别
		dept:'',//院系
		className:'',//专业班次
		totalPoints:'',//考试成绩
		standard:'',//标准
		scoreRemark:'',//备注
		certificate:'',//证书编号
		id:''
      },
    };
  },
  props:{
	params:{
		default:()=>{},
	}
  },
  watch:{
	windowVisible(val){
		if(val && this.dataForm.id == ''){
			Object.assign(this.dataForm,this.$options.data().dataForm)
		}
	}
  },
  components: {ChoseStudent},
  mounted(){
	if(this.dataForm.id){
		this.getDetail()
	}
  },
  methods: {
	choseDialog(){
        this.$refs.choseDialog.dialogVisible = true
    },
	async getDetail(){
		let res = await cusDetail({scoreId:this.dataForm.id});
		if(res.code == 200){
			this.dataForm = res.data
		}
	},
    async saveEdit(){
		let res;
		if(this.dataForm.id){
			res = await saveEditCusExam(this.dataForm);
		}else{
			res = await saveCusExam(this.dataForm);
		}
		if(res.code == 200){
			this.windowVisible = false;
			this.$emit(saveEdit)
		}
    }
  },
};
</script>

<style lang="less" scoped>
@import "../../../styles/commonCss.less";
.my-form-container .my-form-item > div .my-form-item-label{width: 200px;padding-left: 0;justify-content: center;}
.button-group{
    padding-bottom: 56px;
}
.assessment-design {
    .el-textarea__inner {
        resize: none;
        font-size: 16px;
        color: rgba(0, 76, 167, 1);
    }
}
.edit-green{
    background: #F1FFF8;
    border: 1px solid #02C86C;
    color: #02C86C;
	width: 82px;
	height: 27px;
	font-size: 14px;
	margin-left: 10px;
}
</style>
